<extend name="./public/frame.html"/>
<block name="content">
    <style>
        html, body {
            margin: 0px;
            padding: 0px;
            background: #fff;
        }
        a {
            color: #333;
            text-decoration: none;
        }
        .menu {
            margin: 30px;
            height: calc(100vh - 180px);
            overflow-y: scroll;
        }
        .league_cont_flt {
            float: left;
            width: 210px;
            height: calc(100vh - 60px);
            border: 1px solid #e0e0e0;
            border-radius:3px;
        }
        .league_cont_frt {
            float: right;
            width: calc(100vw - 300px);
            height: calc(100vh - 60px);
            border: 1px solid #e0e0e0;
            border-radius:3px;
        }
        .league_cont_title {
            height: 60px;
            border-bottom: 1px solid #e0e0e0;
        }
        .league_cont_title .lea_tit {
            margin-left: 10px;
            line-height: 60px;
            font-weight: 500;
            font-size: 14px;
            float: left;
        }
        .league_cont_title .lea_but {
            height: 34px;
            line-height: 34px;
            font-size: 14px;
            float: right;
            background: #009999;
            margin: 15px 10px 0px 0px;
            padding: 0px 8px;
            color: #fff;
        }
        .lea_all_tit {
            font-size: 16px;
            margin-left: 20px;
            line-height: 60px;
            font-weight: 500;
        }
        .league_table{ padding:20px;}
        .clear{ clear:both;}
        .dtree{padding:20px 10px;
            font-size:14px;
            overflow-y: scroll;
            height: calc(100vh - 161px);
        }
        .dtree input[type="checkbox"]{ width:0; height:0;}
        .dTreeNode a{vertical-align: top;font-size: 12px;}

        .province{ background:url("../../../../public/images/line.gif") left center repeat-y;}
        .province li{ line-height:28px;}
        .province li a{ display:block;}
        .menu_li{ background:url(../../../../public/images/plus.gif) left center no-repeat;}
        .menu_li_zk{ background:url(../../../../public/images/minus.gif) left center no-repeat;}
        .city_list{background:url(../../../../public/images/line.gif) left center repeat-y;    margin-left: 20px;}
        .city_list li a{background:url(../../../../public/images/minus.gif) left center no-repeat;    padding-left: 20px;}

        blockquote {
            -webkit-margin-end: 0px;
        }
    </style>
    <div class="layui-row">
        <div class="layui-col-md2" style="width: 15%">
            <div class="league_cont_flt">
                <div class="league_cont_title"> <span class="lea_tit">推广员列表</span> <a href="javascript:void(0)" class="lea_but" id="refer_add">新增推广员</a></div>
                <div class="menu">
                    <a href="javascript:void(0)">全部</a>
                    <ul class="province">
                        <?php foreach($listInfo as $key=>$value):?>
                        <li>
                            <a class="menu_li" href="javascript:void(0)" style="padding-left: 20px;" onclick="menuClick(<?php echo $value['region_id'];?>);">
                                <?php echo $value['region_name'];?><?php if(!empty($value['number'])):?>（<?php echo $value['number'];?>）<?php endif;?>
                            </a>
                            <ul class="city_list" id="cityList<?php echo $value['region_id'];?>" style="display: none;">
                                <?php foreach($value['CHILD'] as $val):?>
                                <li>
                                    <!--<a href="javascript:void(0)" onclick="referDeail(<?php echo $val['id'];?>);"><?php echo $val['franchisee_name'];?></a>-->
                                    <a href="javascript:void(0)" onclick=""><?php echo $val['franchisee_name'];?></a>
                                </li>
                                <?php endforeach;?>
                            </ul>
                        </li>
                        <?php endforeach;?>
                    </ul>
                </div>
                <script>
                    function menuClick(num){
                        $(".city_list").slideUp("slow");
                        var cssValue = $("#cityList"+num).css('display');
                        if(cssValue == 'none'){
                            $("#cityList"+num).slideDown("slow");
                            $("#cityList"+num).parent().find('a.menu_li').addClass('menu_li_zk');
                        }else{
                            $("#cityList"+num).slideUp("slow");
                            $("#cityList"+num).parent().find('a.menu_li').removeClass('menu_li_zk');
                        }
                    }
                </script>
            </div>
        </div>
        <div class="layui-col-md10">
            <fieldset class="layui-elem-field">
                <div class="layui-field-box">
                    <b style="font-size: 15px;">全部</b>
                </div>
            </fieldset>
            <blockquote class="layui-elem-quote search">
                <div class="layui-inline">
                    <input type="text" name="contact_number" lay-verify="required|number" required placeholder="请输入手机号码" class="layui-input" id="phone">
                </div>
                <div class="layui-inline">
                    <input type="text" name="legal_person" lay-verify="required|name" required placeholder="请输入推广员姓名" class="layui-input" id="legal_person" style="width: 150px;">
                </div>

                <div class="layui-inline">
                    <input type="text" name="startTime" lay-verify="required" required placeholder="请选择开始时间" class="layui-input date" id="startTime">
                </div>
                <div class="layui-inline">
                    <input type="text" name="endTime" lay-verify="required" required placeholder="请选择结束时间" class="layui-input date" id="endTime">
                </div>
                <div class="layui-inline">
                    <button class="layui-btn" data-type="search">搜索</button>
                    <button class="layui-btn layui-btn-warm" data-type="excel">导出数据</button>
                </div>
            </blockquote>

            <!-- 数据统计 -->
            <div>
                <span><b>推广员：</b><span style="color:#009688;">251 </span><b>人</b></span>
                <span style="margin-left: 20px;"><b>推荐人数：</b><span style="color:#009688;">1508 </span><b>人</b></span>
            </div>
            <!-- 数据统计 -->

            <!--<table class="layui-table" lay-data="{width:'auto', height:'auto', url:'{:url('Promoter/index')}', page: true, limit: 10,where: { fid: <?php echo $franchiseeInfo['id'];?>},id:'refer'}" lay-filter="refer">-->
            <table class="layui-table" lay-data="{width:'auto', height:'auto', url:'{:url('Promoter/index')}', page: true, limit: 10,where: { fid:0},id:'promoter'}" lay-filter="promoter">
                <thead>
                <tr>
                    <th lay-data="{checkbox:true, fixed: true}"></th>
                    <th lay-data="{field:'id', width:60,align:'center', fixed: true, sort: true}">ID</th>
                    <th lay-data="{field:'name', width:120,align:'center'}">姓名</th>
                    <th lay-data="{field:'phone', width:180,align:'center'}">手机号</th>
                    <th lay-data="{field:'recomdNum', width:100,align:'center',sort: true}">推荐人数</th>
                    <th lay-data="{field:'orderNum', width:100,align:'center',sort: true}">下单人数</th>
                    <th lay-data="{field:'ordersnNum', width:100,align:'center',sort: true}">订单数</th>
                    <th lay-data="{field:'orderMoney', width:150,align:'center',sort: true}">订单总额（元）</th>
                    <th lay-data="{field:'create_time', width:200,align:'center',sort: true}">添加时间</th>
                    <!--<th lay-data="{fixed:'right', toolbar: '#barDemo', width:260, align:'center'}">操作</th>-->
                </tr>
                </thead>
            </table>
            <!--<div class="layui-hide" id="barDemo">-->
                <!--<a class="layui-btn layui-btn-xs" lay-event="edit" style="width: 50px">修改</a>-->
                <!--<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del" style="width: 50px">删除</a>-->
                <!--<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="code" style="width: 80px">生成二维码</a>-->
            <!--</div>-->
        </div>
    </div>

    <script>
        layui.use(['table','laydate'], function () {
            var table = layui.table
                , laydate = layui.laydate;

            lay('.date').each(function () {
                laydate.render({
                    elem: this,
                    type: 'date',
                    trigger: 'click'
                });
            });
//            //点击添加推广员
//            $(document).on('click', '#refer_add', function(){
//                var fid = "<?php echo $franchiseeInfo['id'];?>";
//                layer.open({
//                    type: 2,
//                    title: '新增推广员',
//                    shadeClose: true,
//                    shade: 0.8,
//                    area: ['600px', '40%'],
//                    content: '{:url("/admin/Refer/refer_add","fid=")}'+fid
//                });
//            });

//            table.on('tool(promoter)', function (obj) {
//                var data = obj.data;
//                var id = data.id;
//                if (obj.event === 'del') {
//                    layer.confirm('确定删除吗?',function(index){
//                        var url = '{:url("/admin/Franchisee/franchisee_del","id=")}' + id
//                        $.get(url,function(data){
//                            if(data.code == 1){
//                                layer.msg(data.msg,{'icon':1});
//                                window.location.reload();
//                            }else{
//                                layer.msg(data.msg,{'icon':2});
//                            }
//                        },'json')
//                        layer.close(index);
//                    })
//
//                } else if (obj.event === 'edit') {
//                    layer.open({
//                        type: 2,
//                        title: '加盟商修改',
//                        shadeClose: true,
//                        shade: 0.8,
//                        area: ['1000px', '65%'],
//                        content: '{:url("/admin/Franchisee/franchisee_edit","id=")}' + id //iframe的url
//                    });
//
//                } else if (obj.event === 'detail') {
//                    layer.open({
//                        type: 2,
//                        title: '加盟商详情',
//                        shadeClose: true,
//                        shade: 0.8,
//                        area: ['100%', '100%'],
//                        content: '{:url("/admin/Franchisee/franchisess_detail","id=")}' + id //iframe的url
//                    });
//                }
//            });
            //点击搜索
            /*$('.layui-btn').on('click', function () {
                var name = $("#name").val();
                table.reload('CarBrand', {
                    url: '/admin/CarBrand/index', where: {
                        "name": name,
                    }
                });
            })*/
        });
//        function referDeail(id){
//            layer.open({
//                type: 2,
//                title: '加盟商详情',
//                shadeClose: true,
//                shade: 0.8,
//                area: ['100%', '100%'],
//                content: '{:url("/admin/Franchisee/franchisess_detail","id=")}' + id //iframe的url
//            });
//        }
    </script>
</block>